import React, {Component} from 'react';
import { QueueAnim } from 'antd';


class MovieTable extends Component {

    doUpdata(num) {
        this.props.doUpdata(num);

    }
    doRemo(num) {
        this.props.remData(num);
    }
    render() {
        var data = this.props.data;
        var tds = new Array();
        if((typeof data) !== 'undefined'){
            for (var index = 0; index < data.length; index++) {
                tds[index] = (
                    <tr key={data[index].key}>
                        <td>{data[index].name}</td>
                        <td>{data[index].synopsis}</td>
                        <td>
                            <a  onClick={this.doUpdata.bind(this, data[index].key)}>修改</a>
                            <span className="ant-divider"></span>
                            <a onClick={this.doRemo.bind(this, data[index].key) }>删除</a>
                        </td>
                    </tr>
                );

            }
        }
        return (

                <table  className="movie-table" >
                    <thead >
                        <tr>
                            <th className="movie-name">电影名</th>
                            <th className="movie-synopsis">电影简介</th>
                            <th className="movie-do">操作</th>
                        </tr>
                    </thead>
                    <QueueAnim component="tbody" type={['right', 'left']}>
                        {tds}
                    </QueueAnim>
                </table>

        );
    }
}



export default MovieTable;